<template>
    <div class="home">
        <div class="home_banner relative">
            <div class="home_logo absolute">
                <router-link to="/home">
                    <img class="homeLogo" src="/static/img/procedure/logo.png">
                </router-link>
            </div>
            <el-carousel :interval="0" arrow="never" class="homeSwiperBanner">
                <el-carousel-item v-for="(item,index) in banner" :key="index">
                    <img @click="toNewsInfo(item.id)" class="absolute home_banner_img" :src="item.imgUrl" width="100%"
                        height="100%">
                </el-carousel-item>
            </el-carousel>
            <div class="width1200 home_header2">
                <ul class="home_header2_ul">
                    <li class="home_tab_active">
                        <a>首页</a>
                    </li>
                    <li>
                        <router-link target="_blank" to="/news/news_1">行业头条</router-link>
                    </li>
                    <li>
                        <router-link target="_blank" to="/news/news_2">通知公告</router-link>
                    </li>
                    <li>
                        <router-link target="_blank" to="/news/newsFlash">考培快讯</router-link>
                    </li>
                    <li>
                        <router-link target="_blank" to="/home/discovery">人才猎头</router-link>
                    </li>
                    <li>
                        <router-link target="_blank" to="/home/about_us">关于我们</router-link>
                    </li>
                </ul>
            </div>
        </div>
        <div class="home_main width1200">
            <div class="home_mian_title">
            </div>
            <div class="home_main_box">
                <ul>
                    <li class="home_main1">
                        <router-link class="home_main_item" target="_blank" to="/study/apply/exam_apply">
                            <img src="/static/img/home/home_exam_apply.png" class="homeImg1">
                            <p>考前培训</p>
                            <span style="padding: 0 20px;text-align: center;display: inline-block;">适用于三类、特种工培训报名</span>
                        </router-link>
                    </li>
                    <li class="home_main3">
                        <router-link class="home_main_item" target="_blank" to="/cont_education/index">
                            <img src="/static/img/home/home_count_educate.png" class="homeImg3">
                            <p>继续教育</p>
                            <span
                                style="padding: 0 20px;text-align: center;display: inline-block;">适用于三类、特种工、专技和建造师人员学习</span>
                        </router-link>
                    </li>
                    <li class="home_main2">
                        <a class="home_main_item" target="_blank" @click="zhuanXun">
                            <img src="/static/img/home/home_online_study.png" class="homeImg2">
                            <p>专项培训</p>
                            <span>适用于专项培训</span>
                        </a>
                    </li>

                    <li class="home_main4">
                        <a @click="goTeach" target="_blank" class="home_main_item" style="position: relative;">
                        <img src="/static/img/home/homeno.png" style="position: absolute;top: 0;right: 0;margin-top: 0;">
                            <img src="/static/img/home/homeno1.png" class="homeImg4">
                            <p>待开放功能</p>
                            <span>该模块暂未开放</span>
                        </a>
                    </li>
                    <li class="home_login_box">
                        <div class="home_login_user">
                            <router-link v-if="String.isEmptyOrNUll(loginInfo.token)" to="/login">
                                <img src="/static/img/home/home_user.png" />
                            </router-link>
                            <div v-else>
                                <a target="_blank" href="/cont_education/user/user_info">
                                    <img
                                        :src="loginInfo.portraitUrl?loginInfo.portraitUrl:'/static/img/home/home_user.png'" />
                                </a>
                            </div>
                        </div>
                        <div v-if="String.isEmptyOrNUll(loginInfo.token)">
                            <router-link style="margin-bottom: 10px;" to="/cont_education/user/user_info">个人中心
                            </router-link>
                            <router-link to="/login" class="home_login_btn home_login_mag">
                                <img src="/static/img/home/home_login_d.png" class="homeLoginImg">
                                <span>登录</span>
                            </router-link>
                            <router-link to="/register" class="home_login_btn">
                                <img src="/static/img/home/home_login_z1.png" class="homeRegisterImg">
                                <span>注册</span>
                            </router-link>
                        </div>
                        <div style="padding: 0 30px;" v-else>
                            <router-link to="/cont_education/user/user_info" style="margin: 10px;">个人中心</router-link>
                            <router-link target="_blank" to="/cont_education/user/user_info" class="home_login_mag"
                                style="font-weight: bold;">
                                欢迎您，{{loginInfo.realName}}
                            </router-link>
                            <a class="home_login_btn" @click="loginOut">
                                <span>退出</span>
                            </a>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="clear"></div>
            <div class="home_mian_title">
            </div>
            <div class="home_notic width1200">
                <div class="home_notic_left">
                    <div class="home_notic_right">
                        <ul>
                            <li class="home_notic_tabs_active">行业头条</li>
                        </ul>
                        <div class="home_notic_contont">
                            <table>
                                <tbody>
                                    <tr v-for="(item,index) in notics1" :key="index" @click="toNewsInfo(item.id)">
                                        <td width="30px">
                                            <span class="right-triangle"></span>
                                        </td>
                                        <td>
                                            <p class="home_table_p" :title="item.title">
                                                {{item.title}}
                                            </p>
                                        </td>
                                        <td class="noticTableDate">
                                            {{new Date(item.updateTime).Format("yyyy-MM-dd")}}
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <router-link target="_blank" to="/news/news_1" class="home_notic_more">查看更多<img
                                src="/static/img/home/home_notic_more.png"></router-link>
                    </div>
                </div>
                <div class="home_notic_right">
                    <ul>
                        <li class="home_notic_tabs_active">通知公告</li>
                    </ul>
                    <div class="home_notic_contont">
                        <table>
                            <tbody>
                                <tr v-for="(item,index) in notics2" :key="index" @click="toNewsInfo(item.id)">
                                    <td width="30px">
                                        <span class="right-triangle"></span>
                                    </td>
                                    <td>
                                        <p class="home_table_p" :title="item.title">
                                            {{item.title}}
                                        </p>
                                    </td>
                                    <td class="noticTableDate">
                                        {{new Date(item.updateTime).Format("yyyy-MM-dd")}}
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <router-link target="_blank" to="/news/news_2" class="home_notic_more">查看更多<img
                            src="/static/img/home/home_notic_more.png"></router-link>
                </div>
                <div class="home_lianxi">
                    <p style="margin-top: 60px;" class="home_fixed_kefu">平台客服电话</p>
                    <p class="home_fixed_tel">0571-82225289</p>
                    <p class="home_fixed_kefu">学校电话</p>
                    <p class="home_fixed_tel">0572-2022804 <br>0572-2033274 </p>
                    <p class="home_fixed_kefu">学时认定联系电话</p>
                    <p class="home_fixed_tel">0572-2211516</p>
                    <!-- <img src="/static/img/index/littleApp.png" class="home_fixed_weixin">
                    <p class="home_fixed_sao">微信扫一扫，使用小程序学习</p> -->
                </div>
                <div class="clear"></div>
            </div>
        </div>
        <div class="home_router_nav">
            <a href="http://jst.zj.gov.cn/" target="_blank">浙江省建设厅</a><span></span>
            <a href="http://jsj.huzhou.gov.cn/" target="_blank">湖州住房和城乡建设局</a><span></span>
            <a href="http://xsglt.hrss.huzhou.gov.cn/#/" target="_blank">继教认定</a><span></span>
            <a href="http://jgzx.jsj.huzhou.gov.cn/portal/index/index.html" target="_blank">湖州市建管中心</a><span></span>
            <a href="http://hzhret.hrss.huzhou.gov.cn:81/netclass/reg/"
                target="_blank">湖州市专业技术人员继续教育平台（一般公需课）</a><span></span>
            <a href="https://zcps.rlsbt.zj.gov.cn/028/client/index.jsp" target="_blank">浙江省职称申报与评审管理服务平台</a>
        </div>
        <div class="clear"></div>
        <div class="home_footer">
            <p class="home_footer_copyrighyt"><a target="_blank" style="color: #FFFFFF;"
                    href="http://beian.miit.gov.cn">©CopyRight 2009-2021 城建职业技能培训学校 http://hzcjpx.com
                    浙ICP备2021005626号-1</a></p>
        </div>
        <el-dialog title="温馨提示" :show-close="false" center :visible.sync="api.config.isWhether.length>0" width="50%">
            <div style="text-align: center;font-size: 20px;">{{api.config.isWhether}}</div>
        </el-dialog>
        <div class="hometan" style="position: fixed;right: 0;top: 50%;z-index: 99999">
            <div style="position: relative;">
                <img src="/static/img/home/home_tan.png" width="260px">
                <a target="_blank" href="http://jk.raytrontech.com/eps-regOnline/">
                    <div
                        style="width: 175px;height: 36px;background-color: transparent;position: absolute;top: 218px;right: 52px;border-radius: 10px;">
                    </div>
                </a>
                <a target="_blank" href="http://60.191.70.100:8099/eps-regOnline/">
                    <div
                        style="width: 175px;height: 36px;background-color: transparent;position: absolute;top: 267px;right: 52px;border-radius: 42px;">
                    </div>
                </a>
            </div>
        </div>
        <div class="hometan plateIn" style="position: fixed;left: -28px;top: 42%;z-index: 99999">
            <div style="position: relative;">
                <img src="/static/img/home/indexPlate.png" width="370px">
                <a target="_blank" href="http://zhejiang.zhujianpeixun.com/">
                    <div class="text_center" style="top: 209px;">
                    </div>
                </a>
                <a target="_blank" href="https://zj.zhujianpeixun.com/">
                    <div class="text_center" style="top: 265px;">
                    </div>
                </a>
                <a target="_blank" href="http://admin.zhujianpeixun.com/">
                    <div class="text_center" style="top: 322px;">
                    </div>
                </a>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "home",
        data() {
            return {
                banner: [],
                notics1: [], //1公告
                notics2: [], //2公告
                loginInfo: {}
            }
        },
        created: function() {
            var user = this.common.getQuery("user");
            if (!String.isEmptyOrNUll(user)) {
                user = JSON.parse(decodeURIComponent(user));
                this.$cookies.set("token", user.token, this.api.config.tokenTime);
                this.$cookies.set("loginInfo", user, this.api.config.tokenTime);
                this.loginInfo = user;
                this.common.getHttpHeaders().token = user.token;
            }
        },
        mounted: function() {
            this.getNewsList();
            if (!String.isEmptyOrNUll(this.$cookies.get('loginInfo'))) {
                this.loginInfo = this.$cookies.get('loginInfo');
            }
        },
        methods: {
            goTeach: function() {
                 this.$message.warning("该模块暂未开放！");
                // this.$message.error("湖州市统一继续教育认定平台即将上线！");
                // var token = this.common.getHttpHeaders().token;
                // console.log(token);
                // if (String.isEmptyOrNUll(token)) {
                //     this.common.toPage("/login");
                //     return;
                // }
                // window.open("http://www.hzzjxsrd.com/info?token=" + token);
            },
            zhuanXun: function() {
                // 当前未有短期培训班
                this.$message.warning("当前未有短期培训班！");
            },
            getNewsList: function() {
                var that = this;
                this.common.post(this.api.getNewsList, {
                    newsType: 0
                }, function(r) {
                    that.banner = r.resultMap;
                });
                this.common.post(this.api.getNewsList, {
                    newsType: 1
                }, function(r) {
                    that.notics1 = r.resultMap;
                });
                this.common.post(this.api.getNewsList, {
                    newsType: 2,
                    pageSize: 10,
                    minId: 0,
                }, function(r) {
                    that.notics2 = r.resultMap;
                });
            },
            toNewsInfo: function(id) {
                window.open(String.Format('/news/news_info/{0}', id));
            },
            loginOut: function() {
                this.$cookies.remove('loginInfo');
                this.$cookies.remove('token');
                this.$cookies.remove('tzgApplyTrainDescriptFee');
                this.$cookies.remove('slryApplyTrainDescriptFee');
                localStorage.clear();
                this.common.toPage("/login");
            }
        }
    }
</script>

<style>
    .plateIn a .text_center {
        width: 200px;
        padding: 0 6px;
        height: 36px;
        line-height: 36px;
        position: absolute;
        /* top: 149px; */
        left: 50%;
        border-radius: 26px;
        margin-left: -110px;
        font-size: 19px;
    }
</style>
